<template>
  <Transition :enter-active-class="enterActiveClass" :leave-active-class="leaveActiveClass">
    <slot></slot>
  </Transition>
</template>

<script setup lang="ts">
export interface Props {
  enterActiveClass?: string
  leaveActiveClass?: string
}
withDefaults(defineProps<Props>(), {
  enterActiveClass: 'animate__animated animate__fadeIn',
  leaveActiveClass: 'animate__animated animate__fadeOut'
})
</script>
